/**
 * 这段代码是一个JavaScript函数，用于处理网页上的修改按钮点击事件。
 * 当用户点击带有 "modify-button" 类名的按钮时，会弹出一个模态框（modal），
 * 并在模态框中填充相关信息。同时，还添加了关闭模态框的功能。
 */
window.onload = function() {
    // 获取所有带有 "modify-button" 类名的按钮
    var modifyButtons = document.getElementsByClassName("modify-button");
    // 获取模态框元素
    var modal = document.getElementById("myModal");
    // 获取关闭按钮元素
    var closeButton = document.getElementsByClassName("close")[0];

    // 为每个修改按钮添加点击事件监听器
    for (var i = 0; i < modifyButtons.length; i++) {
        modifyButtons[i].addEventListener("click", function() {
            // 获取被点击按钮的自定义数据属性
            var userId = this.getAttribute("data-userid");
            var username = this.getAttribute("data-username");
            var role = this.getAttribute("data-role");

            // 将获取到的数据填充到模态框中的表单字段
            document.getElementById("userId").value = userId;
            document.getElementById("username").value = username;
            document.getElementById("role").value = role;

            // 显示模态框
            $('#myModal').modal('show');
        });
    }

    // 为关闭按钮添加点击事件监听器，用于关闭模态框
    closeButton.addEventListener("click", function() {
        $('#myModal').modal('hide');
    });

    // 为窗口添加点击事件监听器，如果点击在模态框外部，关闭模态框
    window.addEventListener("click", function(event) {
        if (event.target === modal) {
            $('#myModal').modal('hide');
        }
    });
};
